import { Provider } from 'react-redux';
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom';
import { Employee, List, IndexApp, AddEmployee, AntDDemo } from './pages';
import store from './store';
import { Divider, Menu } from 'antd';
import { MailOutlined, AppstoreOutlined, SettingOutlined } from '@ant-design/icons';



export default function RouterApp() {
    return (
        <Router>
            <Provider store={store}>
                {/* <div>
                    <table>
                        <tbody>
                            <tr>
                                <td><Link to='/'>Index</Link></td>
                                <Divider type="vertical" />
                                <td><Link to='/addEmployee'>employee</Link></td>
                                <Divider type="vertical" />
                                <td><Link to='/list'>list</Link></td>
                                <Divider type="vertical" />
                                <td><Link to='/antDDemo'>antDDemo</Link></td>
                            </tr>
                        </tbody>
                    </table>
                </div> */}
                <Menu mode="horizontal">
                    <Menu.Item key="mail" icon={<SettingOutlined />}>
                        <Link to='/'>Index</Link>
                    </Menu.Item>
                    <Menu.Item key="mail" icon={<MailOutlined />}>
                        <Link to='/addEmployee'>employee</Link>
                    </Menu.Item>
                    <Menu.Item key="mail" icon={<AppstoreOutlined />}>
                        <Link to='/list'>list</Link>
                    </Menu.Item>
                    <Menu.Item key="mail" icon={<SettingOutlined />}>
                        <Link to='/antDDemo'>antDDemo</Link>
                    </Menu.Item>
                </Menu>
                <Switch>
                    <Route path='/employee/:key' exact>
                        <Employee></Employee>
                    </Route>
                    <Route path='/addEmployee' exact>
                        <AddEmployee></AddEmployee>
                    </Route>
                    <Route path="/list" exact>
                        <List></List>
                    </Route>
                    <Route path="/antDDemo">
                        <AntDDemo></AntDDemo>
                    </Route>
                    <Route path="/">
                        <IndexApp></IndexApp>
                    </Route>
                </Switch>
            </Provider>
        </Router>
    )
}